<template>
   <el-cascader
    v-model="addFormObj.goods_cat"
    :options="goodSortList"
    :props="goodOptionProps"
    clearable 
    ref="cascaderRef"
    @change="goodOptionChange"/>
</template>

<script>
// 网络
import { getGoodsSortData } from '@/network/goodSortRequest';

export default {
  data() {
    return {
      goodSortList: [], // 商品分类列表
      goodOptionProps: {
        label: 'cat_name', // 显示
        value: 'cat_id', // 保存进数组的值(id)
        children: 'children'
      },
    }
  },
  props: {
    addFormObj: Object
  },
  methods: {
    async getGoodsSortDataRequest() { // 获取分类数据列表
      const {meta, data} = await getGoodsSortData();
      if (meta.status !== 200) {
        console.log(meta);
        return this.$message.error(meta.msg);
      }
      // console.log(data);
      return this.goodSortList = data;
    },
    goodOptionChange () { // 级联选择框改变时触发, 只允许选择第三级节点
      // console.log(this.addFormObj.goods_cat);
      this.addFormObj.goods_cat.length === 3 
      ? 
      '' 
      : 
      (this.addFormObj.goods_cat = [], this.$message.error('请选择第三级的节点'));
      return;
    }
  },
  created () {
    this.getGoodsSortDataRequest();
  },
  destroyed() {

  }
}
</script>

<style>

</style>